<script setup>
import MySon from './MySon.vue';
// 爷爷props传了4个，但是我们这里只接受1个，另外3个会挂载在$attrs上
defineProps(['a'])
</script>
<template>
  <div class="myfather">
    <h3>我是父组件</h3>
    <h4>父组件接收到爷爷组件props传递过来的数据:{{ a }}</h4>
    <h4>爷爷传递的props,但是我自己没有接收的数据在$attrs上:{{ $attrs }}</h4>
    <!-- 父亲将剩下的props中的参数通过$attrs传递给孙子组件 -->
    <MySon v-bind="$attrs"></MySon>
  </div>
</template>
<style scoped>
.myfather {
  background-color: #785ea3;
  padding: 10px;
  border: 1px solid rgb(176, 31, 123)
}
</style>